<!DOCTYPE html>
<html lang="zh">

<head>
  <style>
    html,
    body {
      margin: 0;
      padding: 0;
    }

    #cesiumContainer {
      width: 100vw;
      height: 100vh;
    }

    .myPanel {
      position: absolute;
      top: 5px;
      left: 5px;
    }
  </style>
  <link href="./libs/Cesium/Widgets/widgets.css" rel="stylesheet">

  <script src="./libs/Cesium/Cesium.js"></script>
  <script src="./libs/netcdfjs.min.js"></script>
</head>

<body>
  <div id="cesiumContainer"></div>

  <script type="module">
    import Wind3D from "./js/wind3d.esm.js"
    import Panel from "./js/panel.esm.js"
    import { minmax } from "./js/util.esm.js" 

    /* 获取并处理数据 */
    const response = await fetch('./data/test.json')
    const originData = await response.json()
    const data = {
      dimensions: {
        lon: 720,
        lat: 361,
        lev: 1
      },
      lon: {},
      lat: {},
      lev: {},
      u: {},
      v: {}
    }
    const length = originData.length
    data.lon.array = new Float32Array(length)
    data.lat.array = new Float32Array(length)
    data.u.array = new Float32Array(720 * 361).fill(0.1)
    data.v.array = new Float32Array(720 * 361).fill(0.1)
    data.lev.array = new Float32Array([1])
    const longitudeArray = data.lon.array
    const latitudeArray = data.lat.array
    const uArray = data.u.array
    const vArray = data.v.array
    for (let i = 0; i < length; ++i) {
      longitudeArray[i] = +originData[i]["Longitude"]
      latitudeArray[i] = +originData[i]["Latitude"]
      uArray[i] = +originData[i]["eastward"]
      vArray[i] = +originData[i]["northward"]
    }
    data.lon.min = minmax(data.lon.array, false)
    data.lon.max = minmax(data.lon.array, true)
    data.lat.min = minmax(data.lat.array, false)
    data.lat.max = minmax(data.lat.array, true)
    data.lev.min = minmax(data.lev.array, false)
    data.lev.max = minmax(data.lev.array, true)
    data.u.min = -1;
    data.u.max = 1;
    data.v.min = -1;
    data.v.max = 1;
    /* 数据创建完毕 */

    const panel = new Panel()
    const wind3d = new Wind3D(panel, data);
  </script>
</body>

</html>